/**
* Copyright (c) 2022 - present TinyVue Authors.
* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
*
* Use of this source code is governed by an MIT-style license.
*
* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/

/*基础变量定义*/
:root {
   /* 一.颜色*/
    /* 1.基础色:此处的颜色变量为所有组件应用到的颜色，此处颜色仅在公共色中使用，具体组件不可使用*/
  --ti-base-color-white: #fff; /* 彩色按钮或图标上文字、输入框背景色*/

  /* 1.1品牌色*/
  /* 品牌主色*/
  --ti-base-color-brand: #5e7ce0; /* 主色蓝*/
  /* 主色衍生色*/
  --ti-base-color-brand-1: #344899; /* 主色悬浮色/文字按钮、链接悬浮色*/
  --ti-base-color-brand-2: #526ecc; /* 文字按钮颜色/链接颜色*/
  --ti-base-color-brand-3: #7693f5; /* 深色背景下图标*/
  --ti-base-color-brand-4: #96adfa; /* 深色背景链接色*/
  --ti-base-color-brand-5: #beccfa; /* 选块悬浮色/深色背景链接悬浮色/提示边框色/开关组件“开”禁用背景色*/
  --ti-base-color-brand-6: #e9edfa; /* 选块默认色/滑块背景色/分页悬浮色*/
  --ti-base-color-brand-7: #f2f5fc; /* 下拉、列表、悬浮背景/表头/下拉搜索背景*/
  --ti-base-color-brand-8: #464C59; /* 一级tab页签背景色、tips背景色、DIV提示背景色*/
  --ti-base-color-brand-9: #5C6173; /* 一级tab页签背景-悬浮色/页签禁用文字色*/

  /* 1.2中立色*/
  /* 公用灰色系，用于文本、图标、线条色*/
  --ti-base-color-common: #252b3a; /* 正文主色，重要信息、标题颜色、输入类文本颜色*/
  --ti-base-color-common-1: #575d6c; /* 次要信息/图标默认*/
  --ti-base-color-common-2: #8a8e99; /* 弱化信息、说明文字*/
  --ti-base-color-common-3: #adb0b8; /* 边框色（如下拉、输入框）/文字禁用/导航栏文字图标/禁用图标*/
  --ti-base-color-common-4: #dfe1e6; /* 分割线/禁用描边/tab字体/开关组件“关”禁用背景色*/

  /* 1.3背景色*/
  --ti-base-color-bg: #eef0f5; /*  通用背景-页面背景色/下拉搜索框背景色/标签背景色/multiselect输入框中背景*/
  --ti-base-color-bg-1: #f5f5f6; /* 禁用背景/小表格中禁用背景/支付列表中禁用背景*/
  --ti-base-color-bg-2: #fafafa; /* 新区域组件-悬浮背景色*/
  --ti-base-color-bg-3: #c7000b; /* 主要按钮-背景色*/
  --ti-base-color-bg-4: #d64a52; /* 主要按钮-hover/Focus背景色*/
  --ti-base-color-bg-5: #b12220; /* 主要按钮-active背景色*/
  --ti-base-color-bg-6: #ffffff; /* 次要按钮-背景色*/
  --ti-base-color-bg-7: #ffffff; /* 次要按钮-hover/Focus背景色*/
  --ti-base-color-bg-8: #ffffff; /* 次要按钮-active背景色*/
  --ti-base-color-bg-9: #282B33; /* 顶部导航背景色/顶部导航下拉悬浮背景色*/
  --ti-base-color-bg-10: #181818; /* 顶部导航下拉背景色*/

  /* 1.4功能色*/
  --ti-base-color-error: #f66f6a; /* 错误-图标色/校验边框色/图表数据色-8*/
  --ti-base-color-error-text: #de504e; /* 错误-文本色/交易金额*/
  --ti-base-color-error-bg: #ffeeed; /* 错误-1*/
  --ti-base-color-error-border: #ffbcba; /* 错误-边框色*/
  --ti-base-color-error-icon-from:#FF41A1; /* 渐变图标-错误-起始色*/
  --ti-base-color-error-icon-to:#FF8A5B; /* 渐变图标-错误-终止色*/

  --ti-base-color-success: #50d4ab; /* 成功-图标色/图表数据色-1*/
  --ti-base-color-success-text: #3ac295; /* 成功-文本色*/
  --ti-base-color-success-bg: #edfff9; /* 成功-背景色*/
  --ti-base-color-success-border: #acf2dc; /* 成功-边框色*/

  --ti-base-color-warn: #fa9841; /* 告警-图标色、深色背景-运营活动文本色/图表数据色-7*/
  --ti-base-color-warn-text: #e37d29; /* 告警-文本色*/
  --ti-base-color-warn-bg: #fff3e8; /* 告警-背景色*/
  --ti-base-color-warn-border: #ffd0a6; /*  告警-边框色*/
  --ti-base-color-warn-icon-from:#FF5541; /* 渐变图标-告警-起始色*/
  --ti-base-color-warn-icon-to:#FFD347; /* 渐变图标-告警--终止色*/
  --ti-base-color-warn-1: #fac20a; /* 次要告警/状态图标-异常/图表数据色-6/评分组件rate-图标色*/

  --ti-base-color-prompt: var(--ti-base-color-brand); /* 提示-图标色*/
  --ti-base-color-prompt-text: var(--ti-base-color-brand-2); /* 提示-文本色*/
  --ti-base-color-prompt-bg: #ebf6ff; /* 提示-背景色*/
  --ti-base-color-prompt-border: var(--ti-base-color-brand-5); /* 提示-边框色*/
  --ti-base-color-prompt-icon-from: #7769E8; /* 渐变图标-提示-起始色*/
  --ti-base-color-prompt-icon-to: #58BBFF; /* 渐变图标-提示-终止色*/


  /* 状态图标色*/
  --ti-base-color-icon-info: #6cbfff; /* 状态图标-常规、信息提示/图表数据色-2*/

  /* 图表色*/
  --ti-base-color-data-3: #a6dd82; /* 图表数据色-3*/
  --ti-base-color-data-4: #f3689a; /* 图表数据色-4*/
  --ti-base-color-data-5: #a97af8; /* 图表数据色-5*/

  /* 透明色*/
  --ti-base-color-transparent: transparent;

  /* 2.公共色：此处颜色为组件场景色，根据使用场景分为以下几大类，具体组件引用以下颜色，如在使用过程中有问题，请自行按类别添加*/
  /* 2.1提示类型颜色，用于alert组件、涉及功能提示的背景、文字、图标等的颜色使用*/
  --ti-common-color-success: var(--ti-base-color-success); /* 成功-图标色/状态图标-成功*/
  --ti-common-color-text-success: var(--ti-base-color-success-text); /* 成功-文字色*/
  --ti-common-color-success-bg: var(--ti-base-color-success-bg); /* 成功-背景色*/
  --ti-common-color-success-border: var(--ti-base-color-success-border); /* 成功-边框色*/

  --ti-common-color-error: var(--ti-base-color-error); /* 错误-图标色/状态图标-危险、错误、失败/深色Tip中的价格文本*/
  --ti-common-color-error-text: var(--ti-base-color-error-text); /* 错误-文字色*/
  --ti-common-color-error-bg: var(--ti-base-color-error-bg); /* 错误-背景色/校验背景色*/
  --ti-common-color-error-border: var(--ti-base-color-error); /* 错误-校验边框色*/
  --ti-common-color-error-border-secondary: var(--ti-base-color-error-border); /* 错误-alert边框色*/
  --ti-common-color-error-icon-from:var(--ti-base-color-error-icon-from); /* 渐变图标-错误-起始色*/
  --ti-common-color-error-icon-to:var(--ti-base-color-error-icon-to); /* 渐变图标-错误-终止色*/

  --ti-common-color-info: var(--ti-base-color-info-normal); /* 信息-图标色/状态图标-信息*/
  --ti-common-color-info-text: var(--ti-base-color-common); /* 信息-文字色*/
  --ti-common-color-info-bg: rgba(51, 51, 51, 0.06); /* 信息-背景色*/
  --ti-common-color-info-border: #d3d4d6; /* 信息-边框色*/

  --ti-common-color-warn: var(--ti-base-color-warn); /* 告警-图标色/状态图标-警告*/
  --ti-common-color-warn-text: var(--ti-base-color-warn-text); /* 告警-文字色*/
  --ti-common-color-warn-bg: var(--ti-base-color-warn-bg); /* 告警-背景色*/
  --ti-common-color-warn-border: var(--ti-base-color-warn-border); /* 告警-边框色*/
  --ti-common-color-warn-secondary: var(--ti-base-color-warn-1); /* 次要告警-图标色/状态图标-异常*/
  --ti-common-color-warn-icon-from:var(--ti-base-color-warn-icon-from); /* 渐变图标-告警-起始色*/
  --ti-common-color-warn-icon-to:var(--ti-base-color-warn-icon-to); /* 渐变图标-告警--终止色*/

  --ti-common-color-prompt: var(--ti-base-color-prompt); /* 提示-图标色*/
  --ti-common-color-prompt-text: var(--ti-base-color-prompt-text); /* 提示-图标色*/
  --ti-common-color-prompt-bg: var(--ti-base-color-prompt-bg); /* 提示-背景色*/
  --ti-common-color-prompt-border: var(--ti-base-color-prompt-border); /* 提示-边框色*/
  --ti-common-color-prompt-icon-from: var(--ti-base-color-prompt-icon-from); /* 渐变图标-提示-起始色*/
  --ti-common-color-prompt-icon-to: var(--ti-base-color-prompt-icon-to); /* 渐变图标-提示-终止色*/

  /* 2.2文本色*/
  --ti-common-color-text-primary: var(--ti-base-color-common); /* 一级文本色-重要信息/标题颜色/输入类文本颜色*/
  --ti-common-color-text-secondary: var(--ti-base-color-common-1); /* 二级文本色-次要信息*/
  --ti-common-color-text-weaken: var(--ti-base-color-common-2); /* 三级文本色-弱化信息/说明文字*/
  --ti-common-color-text-disabled: var(--ti-base-color-common-3); /* 文本禁用信息*/
  --ti-common-color-text-darkbg: var(--ti-base-color-common-3); /* 深色背景下文本信息*/
  --ti-common-color-text-darkbg-disabled: var(--ti-base-color-common-1); /* 深色背景下文本信息禁用色*/
  --ti-common-color-text-link: var(--ti-base-color-brand-2); /* 链接色*/
  --ti-common-color-text-link-hover: var(--ti-base-color-brand-1); /* 链接悬浮色*/
  --ti-common-color-text-link-darkbg: var(--ti-base-color-brand-4); /* 深色背景链接色*/
  --ti-common-color-text-link-darkbg-hover: var(--ti-base-color-brand-5); /* 深色背景链接悬浮色*/
  --ti-common-color-text-link-darkbg-card-hover: var(--ti-base-color-brand-4); /* 深色背景卡片式链接悬浮色*/
  --ti-common-color-text-highlight: var(--ti-base-color-brand-2); /* 文本高亮色*/
  --ti-common-color-text-white: var(--ti-base-color-white); /* 深色背景或图标上文字色*/
  --ti-common-color-text-gray: var(--ti-base-color-white); /* 深色背景下的文本色，用于tip*/
  --ti-common-color-text-gray-disabled: var(--ti-base-color-brand-9); /* 深色背景下的灰色文本禁用色，用于tab页签中*/
  --ti-common-color-text-important: var(--ti-base-color-error-text); /* 文本_金额*/

    /* 深色背景文本色*/
    --ti-common-color-text-primary-dark: var(--ti-base-color-white);
    --ti-common-color-text-secondary-dark: var(--ti-base-color-common-3);
    --ti-common-color-text-highlight-dark: var(--ti-base-color-white);
    --ti-common-color-text-dark-active: var(--ti-base-color-common);
    --ti-common-color-text-dark-disabled: var(--ti-base-color-brand-9);
  


    /* 2.3图标色*/
    /* 浅底背景图标色*/
  --ti-common-color-icon-normal: var(--ti-base-color-common-1);
  --ti-common-color-icon-hover: var(--ti-base-color-brand);
  --ti-common-color-icon-active: var(--ti-base-color-brand);
  --ti-common-color-icon-disabled: var(--ti-base-color-common-3); /* 图标禁用色/状态图标-禁用、停止*/
  --ti-common-color-icon-white: var(--ti-base-color-white);

  /* 灰色背景下图标色*/
  --ti-common-color-icon-graybg-normal: var(--ti-base-color-common-3);
  --ti-common-color-icon-graybg-hover: var(--ti-base-color-brand);
  --ti-common-color-icon-graybg-active: var(--ti-base-color-brand);
  --ti-common-color-icon-graybg-disabled: var(--ti-base-color-common-4);

  /* 深底背景图标色*/
  --ti-common-color-icon-darkbg-normal: var(--ti-base-color-common-3);
  --ti-common-color-icon-darkbg-hover: var(--ti-base-color-brand-3);
  --ti-common-color-icon-darkbg-active: var(--ti-base-color-brand-3);
  --ti-common-color-icon-darkbg-disabled: var(--ti-base-color-common-4);

  /* 深底背景卡片式图标色*/
  --ti-common-color-icon-dark-card-normal: var(--ti-base-color-common-3);
  --ti-common-color-icon-dark-card-hover: var(--ti-base-color-brand-3);
  --ti-common-color-icon-dark-card-active: var(--ti-base-color-brand-3);
  --ti-common-color-icon-dark-card-disabled: var(--ti-base-color-common-1);
  --ti-common-color-icon-dark-card-white: var(--ti-base-color-white);

  /* 状态图标背景色*/
  --ti-common-color-icon-info: var(--ti-base-color-icon-info); /* 状态图标-常规、信息提示*/

  /* 2.4线颜色，用于边框，线条等的颜色使用*/
  --ti-common-color-line-normal: var(--ti-base-color-common-3);
  --ti-common-color-line-hover: var(--ti-base-color-common-1);
  --ti-common-color-line-active: var(--ti-base-color-brand);
  --ti-common-color-line-disabled: var(--ti-base-color-common-4);

  /* 分割线颜色*/
  --ti-common-color-line-dividing: var(--ti-base-color-common-4);
  --ti-common-color-line-dividing-dark: var(--ti-base-color-common-1);

  /* 虚线*/
  --ti-common-color-dash-line-normal: var(--ti-base-color-common-1);
  --ti-common-color-dash-line-hover: var(--ti-base-color-brand-2);

  /* 2.5背景色*/
  /* 背景基础色各状态色*/
  --ti-common-color-bg-normal: var(--ti-base-color-bg); /* 通用背景-页面背景色/下拉搜索框背景色/标签背景色*/
  --ti-common-color-bg-emphasize: var(--ti-base-color-brand); /* 背景高亮色*/
  --ti-common-color-bg-disabled: var(--ti-base-color-bg-1); /* 禁用背景色*/
  --ti-common-color-bg-hover: var(--ti-base-color-brand-1); /* 主色背景悬浮色*/
  --ti-common-color-bg-gray: var(--ti-base-color-bg-2); /* 新区域组件-悬浮背景色*/
  --ti-common-color-bg-secondary: var(--ti-base-color-common-3); /* 开关组件-关闭状态-背景色*/

  /* 重要背景色，主要用于重要按钮场景*/
  --ti-common-bg-primary: var(--ti-base-color-bg-3); /* 重要按钮背景色*/
  --ti-common-bg-primary-hover: var(--ti-base-color-bg-4); /* 重要按钮背景悬浮、focus色*/
  --ti-common-bg-primary-active: var(--ti-base-color-bg-5); /* 重要按钮背景色按下色*/

  /* 次要背景色，主要用于次要按钮场景*/
  --ti-common-bg-minor: var(--ti-base-color-bg-6); /* 次要按钮背景色*/
  --ti-common-bg-minor-hover: var(--ti-base-color-bg-7); /* 次要按钮背景悬浮、focus色*/
  --ti-common-bg-minor-active: var(--ti-base-color-bg-8); /* 次要按钮背景色按下色*/

  /* 白底背景状态色*/
  --ti-common-color-bg-white-normal: var(--ti-base-color-white); /* 白色背景，用于输入框背景*/
  --ti-common-color-bg-white-emphasize: var(--ti-base-color-brand-7); /* 白色hover或强调色，如表头背景、表格悬浮、下拉选项悬浮背景*/

  /* 浅底背景状态色*/
  --ti-common-color-bg-light-normal: var(--ti-base-color-brand-6); /* 滑块slider-背景色/多选快buttongroup-默认背景色/树组件选中背景色*/
  --ti-common-color-bg-light-emphasize: var(--ti-base-color-brand-5); /* 浅背景hover或强调色，开关组件“开”禁用背景色*/

  /* 深色底背景状态色*/
  --ti-common-color-bg-dark-normal: var(--ti-base-color-brand-8); /* 一级tab页签背景色*/
  --ti-common-color-bg-dark-emphasize: var(--ti-base-color-brand-9); /* 一级tab页签背景-悬浮色*/
  --ti-common-color-bg-dark-active: var(--ti-common-color-bg-normal); /* 一级tab页签背景-激活/focus状态背景色*/
  --ti-common-color-bg-dark-deep: var(--ti-base-color-brand-8); /* tip、alert提示背景色*/
  --ti-common-color-bg-dark-disabled: var(--ti-base-color-common-4); /* 深色背景禁用色，开关组件“关”禁用背景色*/

  /* 顶部导航*/
  --ti-common-color-bg-navigation: var(--ti-base-color-bg-9); /* 顶部导航背景色/顶部导航下拉悬浮背景色*/
  --ti-common-color-bg-dark-select: var(--ti-base-color-bg-10); /* 顶部导航下拉背景色 */

  /* 表格头部背景色*/
  --ti-common-color-bg-table-header: var(--ti-common-color-bg-white-emphasize);

  /* 深色背景步骤色*/
  --ti-common-color-steps-dark: var(--ti-base-color-brand-3);

  /* 2.6 图表色*/
  --ti-common-color-data-1: var(--ti-base-color-success); /* 图表数据色-1*/
  --ti-common-color-data-2: var(--ti-base-color-icon-info); /* 图表数据色-2*/
  --ti-common-color-data-3: var(--ti-base-color-data-3); /* 图表数据色-3*/
  --ti-common-color-data-4: var(--ti-base-color-data-4); /* 图表数据色-4*/
  --ti-common-color-data-5: var(--ti-base-color-data-5); /* 图表数据色-5*/
  --ti-common-color-data-6: var(--ti-base-color-warn-1); /* 图表数据色-6*/
  --ti-common-color-data-7: var(--ti-base-color-warn); /* 图表数据色-7*/
  --ti-common-color-data-8: var(--ti-base-color-error); /* 图表数据色-8*/

  /* 二.其他变量*/
  /* 边框圆角*/
  --ti-common-border-radius-normal: 2px; /* 常规*/
  --ti-common-border-radius-1: 4px; /* 圆角-1*/
  --ti-common-border-radius-2: 8px; /* 圆角-2*/

  /* 字号*/
  --ti-common-font-size-base: 12px; /* 默认字号*/
  --ti-common-font-size-1: 14px; /* 卡片标题*/
  --ti-common-font-size-2: 16px; /* 页面标题*/
  --ti-common-font-size-3: 18px; /* 弹窗标题、数字*/
  --ti-common-font-size-4: 20px; /* 数字、面额*/
  --ti-common-font-size-5: 24px; /* 数字、面额*/
  --ti-common-font-size-6: 32px; /* 数字、面额*/
  --ti-common-font-size-7: 36px; /* 数字、面额*/

  /* 行高*/
  --ti-common-line-height-number: 1.5; /* 文字行高倍数，建议组件中设置行高使用该变量，如有特殊情况，请自行定义*/

  /* 间距：适用于组件中的margin、padding*/
  --ti-common-space-base: 4px; /* 基础间距，组件中使用的主流间距都是该间距的整数倍*/
  --ti-common-space-2x: calc(var(--ti-common-space-base) * 2); /* 间距-2*/
  --ti-common-space-3x: calc(var(--ti-common-space-base) * 3); /* 间距-3*/
  --ti-common-space-4x: calc(var(--ti-common-space-base) * 4); /* 间距-4*/
  --ti-common-space-5x: calc(var(--ti-common-space-base) * 5); /* 间距-5*/
  --ti-common-space-6x: calc(var(--ti-common-space-base) * 6); /* 间距-6*/
  --ti-common-space-8x: calc(var(--ti-common-space-base) * 8); /* 间距-7*/
  --ti-common-space-10x: calc(var(--ti-common-space-base) * 10); /* 间距-8*/
  /* 其他间距*/
  --ti-common-space-0: 0px; /* 其他间距-1*/
  --ti-common-space-1: 1px; /* 其他间距-2*/
  --ti-common-space-6: 6px; /* 其他间距-3*/
  --ti-common-space-10: 10px; /* 其他间距-4*/

  /* 阴影*/
  --ti-common-shadow-1-up: 0 -1px 4px 0 rgba(0, 0, 0, 0.1); /* 购买浮层*/
  --ti-common-shadow-1-down: 0 1px 4px 0 rgba(0, 0, 0, 0.1); /* 页面卡片，滑块*/
  --ti-common-shadow-1-left: -1px 0px 4px 0 rgba(0, 0, 0, 0.1); 
  --ti-common-shadow-1-right: 1px 0px 4px 0 rgba(0, 0, 0, 0.1); /* 手风琴（leftmenu）*/
  --ti-common-shadow-2-up: 0 -2px 8px 0 rgba(0, 0, 0, 0.2);
  --ti-common-shadow-2-down: 0 2px 8px 0 rgba(0, 0, 0, 0.2); /* 下拉菜单、使用指南*/
  --ti-common-shadow-2-left: -2px 0 8px 0 rgba(238, 10, 10, 0.2);
  --ti-common-shadow-2-right: 2px 0 8px 0 rgba(252, 5, 5, 0.2);
  --ti-common-shadow-3-up: 0 -4px 16px 0 rgba(0, 0, 0, 0.2);
  --ti-common-shadow-3-down: 0 4px 16px 0 rgba(0, 0, 0, 0.2); /* 卡片hover、tips提示*/
  --ti-common-shadow-3-left: -4px 0 16px 0 rgba(0, 0, 0, 0.2);
  --ti-common-shadow-3-right: 4px 0 16px 0 rgba(0, 0, 0, 0.2);
  --ti-common-shadow-4-up: 0 -8px 40px 0 rgba(0, 0, 0, 0.2);
  --ti-common-shadow-4-down: 0 8px 40px 0 rgba(0, 0, 0, 0.2); /* 弹窗、气泡确认框*/
  --ti-common-shadow-4-left: -8px 0 40px 0 rgba(0, 0, 0, 0.2); /* 右侧抽屉*/
  --ti-common-shadow-4-right: 8px 0 40px 0 rgba(0, 0, 0, 0.2);

  /* 提示类阴影*/
  --ti-common-shadow-error: 0 1px 3px 0 rgba(199, 54, 54, 0.25); /* 错误*/
  --ti-common-shadow-warn: 0 1px 3px 0 rgba(204, 100, 20, 0.25); /* 告警*/
  --ti-common-shadow-prompt: 0 1px 3px 0 rgba(70, 94, 184, 0.25); /* 提示*/
  --ti-common-shadow-success: 0 1px 3px 0 rgba(39, 176, 128, 0.25); /* 成功*/

  /* 字体*/
  --ti-common-font-family: 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei';

  /* 字重*/
  --ti-common-font-weight-1: 100; /* 极细*/
  --ti-common-font-weight-2: 200; /* 纤细*/
  --ti-common-font-weight-3: 300; /* 细体*/
  --ti-common-font-weight-4: normal; /* 常规*/
  --ti-common-font-weight-5: 500; /* 中等*/
  --ti-common-font-weight-6: 600; /* 半粗*/
  --ti-common-font-weight-7: bold; /* 粗体*/
  --ti-common-font-weight-8: 800; /* 中黑*/
  --ti-common-font-weight-9: 900; /* 黑体*/

  /* 边框粗细*/
  --ti-common-border-weight-normal: 1px; /* 常规*/
  --ti-common-border-weight-1: 2px; /* 较粗*/
  --ti-common-border-weight-2: 3px; /* 粗*/

  /* 边框样式*/
  --ti-common-border-style-dashed: dashed; /* 虚线*/
  --ti-common-border-style-dotted: dotted; /* 点线*/
  --ti-common-border-style-solid: solid; /* 实线*/

  /* 尺寸*/
  --ti-common-size-base: 4px; /* 基础尺寸*/
  --ti-common-size-2x: calc(var(--ti-common-size-base) * 2); /* 尺寸-2*/
  --ti-common-size-3x: calc(var(--ti-common-size-base) * 3); /* 尺寸-3*/
  --ti-common-size-4x: calc(var(--ti-common-size-base) * 4); /* 尺寸-4*/
  --ti-common-size-5x: calc(var(--ti-common-size-base) * 5); /* 尺寸-5*/
  --ti-common-size-6x: calc(var(--ti-common-size-base) * 6); /* 尺寸-6*/
  --ti-common-size-7x: calc(var(--ti-common-size-base) * 7); /* 尺寸-7*/
  --ti-common-size-8x: calc(var(--ti-common-size-base) * 8); /* 尺寸-8*/
  --ti-common-size-9x: calc(var(--ti-common-size-base) * 9); /* 尺寸-9*/
  --ti-common-size-10x: calc(var(--ti-common-size-base) * 10); /* 尺寸-10*/
  --ti-common-size-11x: calc(var(--ti-common-size-base) * 11); /* 尺寸-11*/
  --ti-common-size-12x: calc(var(--ti-common-size-base) * 12); /* 尺寸-12*/
  --ti-common-size-13x: calc(var(--ti-common-size-base) * 13); /* 尺寸-13*/
  --ti-common-size-14x: calc(var(--ti-common-size-base) * 14); /* 尺寸-14*/
  --ti-common-size-15x: calc(var(--ti-common-size-base) * 15); /* 尺寸-15*/
  --ti-common-size-16x: calc(var(--ti-common-size-base) * 16); /* 尺寸-16*/
  --ti-common-size-17x: calc(var(--ti-common-size-base) * 17); /* 尺寸-17*/
  --ti-common-size-18x: calc(var(--ti-common-size-base) * 18); /* 尺寸-18*/
  --ti-common-size-19x: calc(var(--ti-common-size-base) * 19); /* 尺寸-19*/
  --ti-common-size-20x: calc(var(--ti-common-size-base) * 20); /* 尺寸-20*/
  --ti-common-size-21x: calc(var(--ti-common-size-base) * 21); /* 尺寸-21*/
  --ti-common-size-22x: calc(var(--ti-common-size-base) * 22); /* 尺寸-22*/
  --ti-common-size-23x: calc(var(--ti-common-size-base) * 23); /* 尺寸-23*/
  --ti-common-size-24x: calc(var(--ti-common-size-base) * 24); /* 尺寸-24*/
  --ti-common-size-25x: calc(var(--ti-common-size-base) * 25); /* 尺寸-25*/
  --ti-common-size-26x: calc(var(--ti-common-size-base) * 26); /* 尺寸-26*/
  --ti-common-size-27x: calc(var(--ti-common-size-base) * 27); /* 尺寸-27*/
  --ti-common-size-28x: calc(var(--ti-common-size-base) * 28); /* 尺寸-28*/
  --ti-common-size-29x: calc(var(--ti-common-size-base) * 29); /* 尺寸-29*/
  --ti-common-size-30x: calc(var(--ti-common-size-base) * 30); /* 尺寸-30*/
  --ti-common-size-31x: calc(var(--ti-common-size-base) * 31); /* 尺寸-31*/
  --ti-common-size-32x: calc(var(--ti-common-size-base) * 32); /* 尺寸-32*/
  --ti-common-size-33x: calc(var(--ti-common-size-base) * 33); /* 尺寸-33*/
  --ti-common-size-34x: calc(var(--ti-common-size-base) * 34); /* 尺寸-34*/
  --ti-common-size-35x: calc(var(--ti-common-size-base) * 35); /* 尺寸-35*/
  --ti-common-size-36x: calc(var(--ti-common-size-base) * 36); /* 尺寸-36*/
  --ti-common-size-37x: calc(var(--ti-common-size-base) * 37); /* 尺寸-37*/
  --ti-common-size-38x: calc(var(--ti-common-size-base) * 38); /* 尺寸-38*/
  --ti-common-size-39x: calc(var(--ti-common-size-base) * 39); /* 尺寸-39*/
  --ti-common-size-40x: calc(var(--ti-common-size-base) * 40); /* 尺寸-40*/
  --ti-common-size-41x: calc(var(--ti-common-size-base) * 41); /* 尺寸-41*/
  --ti-common-size-42x: calc(var(--ti-common-size-base) * 42); /* 尺寸-42*/
  --ti-common-size-43x: calc(var(--ti-common-size-base) * 43); /* 尺寸-43*/
  --ti-common-size-44x: calc(var(--ti-common-size-base) * 44); /* 尺寸-44*/
  --ti-common-size-45x: calc(var(--ti-common-size-base) * 45); /* 尺寸-45*/
  --ti-common-size-46x: calc(var(--ti-common-size-base) * 46); /* 尺寸-46*/
  --ti-common-size-47x: calc(var(--ti-common-size-base) * 47); /* 尺寸-47*/
  --ti-common-size-48x: calc(var(--ti-common-size-base) * 48); /* 尺寸-48*/
  --ti-common-size-49x: calc(var(--ti-common-size-base) * 49); /* 尺寸-49*/
  --ti-common-size-50x: calc(var(--ti-common-size-base) * 50); /* 尺寸-50*/
  /* 其他尺寸*/
  --ti-common-size-0: 0px; /* 其他尺寸-1*/
  --ti-common-size-auto: auto; /* 其他尺寸-2*/

  /* 2022.9.23 补充 */
  --ti-base-color-primary-normal: var(--ti-base-color-brand);
  --ti-base-color-primary-hover: var(--ti-base-color-brand-3);
  --ti-base-color-primary-active: var(--ti-base-color-brand-3);
  --ti-base-color-primary-disabled: #a0cfff;
  --ti-base-color-primary-disabled-border: var(--ti-common-color-line-disabled);
  --ti-base-color-primary-disabled-text: var(--ti-common-color-text-disabled);

  --ti-base-color-success-normal: var(--ti-common-color-success);
  --ti-base-color-success-hover: var(--ti-common-color-success-border);
  --ti-base-color-success-active: var(--ti-common-color-success-border);
  --ti-base-color-success-disabled: #a6c3b9;
  --ti-base-color-success-disabled-border: var(--ti-common-color-line-disabled);
  --ti-base-color-success-disabled-text: var(--ti-common-color-text-disabled);

  --ti-base-color-warning-normal: var(--ti-common-color-warn);
  --ti-base-color-warning-hover: var(--ti-common-color-warn-secondary);
  --ti-base-color-warning-active: var(--ti-common-color-warn-secondary);
  --ti-base-color-warning-disabled: #d3c6a2;
  --ti-base-color-warning-disabled-border: var(--ti-common-color-line-disabled);
  --ti-base-color-warning-disabled-text: var(--ti-common-color-text-disabled);

  --ti-base-color-danger-normal: var(--ti-common-bg-primary);
  --ti-base-color-danger-hover: var(--ti-common-bg-primary-hover);
  --ti-base-color-danger-active: var(--ti-common-bg-primary-active);
  --ti-base-color-danger-disabled: #d8bab5;
  --ti-base-color-danger-disabled-border: var(--ti-common-color-line-disabled);
  --ti-base-color-danger-disabled-text: var(--ti-common-color-text-disabled);

  --ti-base-color-info-normal: var(--ti-base-color-common);
  --ti-base-color-info-hover: #54657e;
  --ti-base-color-info-active: #54657e;
  --ti-base-color-info-disabled: #bfbfbf;
  --ti-base-color-info-disabled-border: var(--ti-common-color-line-disabled);
  --ti-base-color-info-disabled-text: var(--ti-common-color-text-disabled);

  --ti-base-color-border: var(--ti-base-color-common-3);
  --ti-base-color-border-hover: var(--ti-base-color-common-1);
  --ti-base-color-light: #fff;
  --ti-base-color-hover-background: var(--ti-base-color-brand-7);
  --ti-base-color-selected-background: var(--ti-base-color-brand); /* 下拉框选中时的背景色 */
  --ti-base-color-selected-text-color: var(--ti-base-color-light); /* 下拉框选中时文字的颜色 */
  --ti-base-size-height-normal: 30px;
  --ti-base-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  --ti-base-dropdown-gap: 2px;

  /* 2022.10.09 补充 */
  --ti-base-color-dark: #000;
  --ti-base-color-secondary: #666;
  --ti-base-color-placeholder: #999;
  --ti-base-color-navigation-background: #2e3243;
  --ti-base-radius-large: 3px;
  --ti-base-radius-medium: 2px;
  --ti-base-radius-small: 1px;
  --ti-base-font-size: 12px;
  --ti-base-font-size-normal: 1em;
  --ti-base-font-size-large: 1.125em;
  --ti-base-font-weight-bold: 700;
  --ti-base-size-width-large: 130px;
  --ti-base-size-width-medium: 120px;
  --ti-base-size-width-normal: 80px;
  --ti-base-size-width-small: 36px;
  --ti-base-size-width-minor: 30px;
  --ti-base-size-width-mini: 24px;
  --ti-base-size-height-large: 48px;
  --ti-base-size-height-medium: 42px;
  --ti-base-size-height-small: 28px;
  --ti-base-size-height-minor: 30px;
  --ti-base-size-height-mini: 24px;
}
